<div ng-controller="bpmTaskFormController">
    <div class="bg-light lter b-b wrapper-md">
        <div><h1 class="m-n font-thin h3">
            任务办理—[{{task.name}}]<span ng-if="task.processDefinitionId">，流程定义ID：[{{task.processDefinitionId}}]</span>
        </h1></div>
    </div>
    <div class="panel panel-default">
        <div class="panel-body">
            <div class="m-b">
                <div class="col-sm-3 pull-right">
                             <span>
                                <i class="glyphicon glyphicon-calendar"></i>创建日期：{{task.createTime | date : 'yyyy-MM-dd hh:mm:ss'}}
                            </span>
                </div>
                <div class="col-sm-2 pull-right">
                             <span>
                                 <span ng-click="status.priorityStatus = !status.priorityStatus">
                                        <i class="glyphicon glyphicon-flag"></i>优先级：
                                        <span ng-if="status.priorityStatus">
                                            <span class='priority' ng-if="!task.priority">无优先级</span>
                                            <span class='priority' ng-if="task.priority">
                                                    <span ng-if="task.priority == 1">低</span>
                                                    <span ng-if="task.priority == 50">中</span>
                                                    <span ng-if="task.priority == 100">高</span>
                                            </span>
                                        </span>
                                </span>

                                <select ng-if="!status.priorityStatus" ng-model="tempForm.priority"
                                        style="width:50px;"
                                        ng-change="changeProperties('priority', task.id, tempForm.priority)">
                                    <option value="1">低</option>
                                    <option value="50">中</option>
                                    <option value="100">高</option>
                                </select>
                            </span>
                </div>
                <div class="col-sm-3 pull-right">
                            <div class="input-group">
                                <span>
                                    <i class="glyphicon glyphicon-calendar"></i>到期日：
                                    <span ng-if="status.dueDateStatus">
                                        <span class='due-date' ng-if="!task.dueDate">无到期日</span>
                                        <span class='due-date' ng-if="task.dueDate">{{task.dueDate | date : 'yyyy-MM-dd'}}</span>
                                    </span>
                                </span>
<!--                                 <input ng-if="!status.dueDateStatus" type="text" name="dueDate" -->
<!--                                        class="due-date-input datepicker input-small" ng-model="tempForm.dueDate" -->
<!--                                        d-datepicker d-datepicker-option="{format : 'YYYY-MM-DD'}"> -->
                            </div>
                </div>

            </div>
            <div class="row" ng-if="parentTask">
                <div ng-if="!parentTask.endTime" class="panel-body">
                    该任务属于：<a app-auth ui-sref="app.bpm.manager.task.form({taskId:parentTask.id})">{{parentTask.name}}</a>
                </div>
                <div ng-if="parentTask.endTime" class="panel-body">
                    该任务属于：<a
                        app-auth ui-sref="app.bpm.history.finsh.view({processInstanceId:parentTask.id})">{{parentTask.name}}</a>
                </div>
            </div>
            <div class="row">
                <div ng-if="!task.description" class="panel-body">
                    <p class="text-muted">该任务无描述。</p>
                </div>
                <div ng-if="task.description" class="panel-body">
                    <p class="text-infos">{{task.description}}</p>
                </div>
            </div>

            <div class="row">
                <div class="col-sm-4">
                    任务人员
                    <!--<a data-target="#addPeopleModal" class="btn btn-small btn-success" data-toggle="modal"-->
                       <!--style="margin-left: 4em;"><i class="glyphicon glyphicon-plus"></i>邀请参与人</a>-->
                    <!--<a ng-if="!task.assignee" href="#addCandidateModal" class="btn btn-small btn-success"-->
                       <!--data-toggle="modal" style="margin-left: 4em;"><i-->
                            <!--class="glyphicon glyphicon-plus"></i>添加候选[人|组]</a>-->
                </div>
            </div>
            <div class="row">
                <div class="col-sm-4">
                    <span><i class="glyphicon glyphicon-user"></i>拥有人：<span id="owner">{{!task.owner ? task.owner :  '无'}}</span></span>
                    <select id="ownerSelect" style="display:none;width:100px;"
                            ng-options="row.id as row.firstName for row in map.users">
                    </select>
                </div>
                <div class="col-sm-4">
                            <span><i class="glyphicon glyphicon-user"></i>办理人：
                                <span id="assignee"
                                      ng-if="task.assignee">{{task.assignee}}</span>
                                <span id="assignee" ng-if="!task.assignee">无</span>
                            </span>
                    <select id="assigneeSelect" style="display:none;width:100px;"
                            ng-options="row.id as row.firstName for row in map.users">
                    </select>
                </div>

                <div class="col-sm-4">
                    <!-- 未委派 -->
					<span ng-if="!task.delegationState" ng-click="status.delegationStateStatus = !status.delegationStateStatus">
						<i class="glyphicon glyphicon-user"></i>任务委派： <span ng-if="status.delegationStateStatus">{{!task.delegationState ? '无' : task.delegationState }}</span>
					</span>
					<!-- 已委派 -->
                    <span ng-if="task.delegationState"
                          ng-click="status.delegationStateStatus = !status.delegationStateStatus">
                        <i class="glyphicon glyphicon-user"></i>任务委派：
                        <span id="delegateState" ng-if="status.delegationStateStatus">
                            <i ng-if="task.delegationState == 'PENDING'" class="glyphicon glyphicon-ok">被委派</i>
                            <i ng-if="task.delegationState == 'RESOLVED'" class="glyphicon glyphicon-ok">任务已处理完成</i>
                        </span>
                    </span>
                    <select ng-if="!status.delegationStateStatus" style="width:100px;"
                            ng-model="tempForm.delegationState" ui-jq="chosen"
                            ng-options="row.id as row.firstName for row in map.users"
                            ng-change="delegate(task.id, tempForm.delegationState)">
                    </select>
                </div>
            </div>
            <hr>


            <div class="row">
                <div class="col-xs-6">
                    <!-- 子任务 -->
                    <p class="text-left">
                    <h4 style="border-bottom: 1px solid #eee">子任务
                        <!--<a href="#addSubtaskModal" data-toggle="modal" class="btn btn-small btn-success pull-right">-->
                        <!--<i class="glyphicon glyphicon-plus"></i>添加-->
                        <!--</a>-->
                    </h4>
                    <ol style="margin-top: 5px">
                        <li ng-repeat="subTask in map.subTasks">
                            <!-- 根据任务完成状态显示不同的图标 -->
                            <i class="glyphicon glyphicon-{{!subTask.endTime ? 'user' : 'ok'}}"></i>

                            <a ng-if="!subTask.endTime" href="{{subTask.id}}" class="task-name">{{subTask.name}}</a>
                            <a ng-if="subTask.endTime" href="${ctx}/chapter6/task/archived/${subTask.id}"
                               class="task-name">
                                {{subTask.name}}（完成时间：{{subTask.endTime | date : 'yyyy-MM-dd hh:mm:ss'}}"）</a>
                            <a ng-if="subTask.owner == user.id && !subTask.endTime" href="javascript:;"
                               style="margin-left: 1em;" class="subtask-delete" data-taskid="${subTask.id}"><i
                                    class="glyphicon glyphicon-remove"></i>删除</a>
                        </li>
                    </ol>
                    </p>
                </div>
                <!-- /.子任务 -->
                <div class="col-xs-6">
                    <!-- 附件 -->
                    <div>
                        <h4 style="border-bottom: 1px solid #eee">相关附件
                            <button ng-click="addAttachment(task.id, task.processInstanceId)" data-toggle="modal"
                                    class="btn btn-small btn-success pull-right" href="#">
                                <i class="glyphicon glyphicon-plus"></i>添加
                            </button>
                        </h4>
                        <ol style="margin-top: 5px">
                            <li ng-repeat="attachment in map.attachments">
                                <!-- url类型的文件 -->
                                <a ng-if="attachment.type == 'url'" href="{{attachment.url}}" target="_blank"
                                   data-toggle="tooltip" title="地址：{{attachment.url}}<br/>描述：{{attachment.description}}"
                                   data-placement="right" class="attachment-item"><i
                                        class="glyphicon glyphicon-share"></i>{{attachment.name}}</a>
                                <!-- 文件类型的文件 -->
                                <a ng-if="attachment.type != 'url'" href="bpm/attachment/download/{{attachment.id}}.do"
                                   target="_blank" data-toggle="tooltip" title="{{attachment.description}}"
                                   data-placement="right" class="attachment-item"><i
                                        class="glyphicon glyphicon-file"></i>{{attachment.name}}</a>
                                <a ng-click="deleteAttachment(attachment.id, attachment.name)"><i
                                        class="glyphicon glyphicon-remove"></i>删除</a>
                            </li>
                        </ol>
                    </div>
                </div>
            </div>
        </div>
        <hr>
        <ng-form role="form" name="form" class="form-validation">
            <div class="panel-body" ng-if="!map.hasStartFormKey">
                <div class="form-group col-sm-6 no-padder" ng-repeat="fp in map.taskFormData.formProperties">
                    <label class="col-sm-3 control-label">{{fp.name}}</label>

                    <div class="col-sm-9" ng-if="fp.type.name == 'string'">
                        <input type="text" class="form-control m-b-xs" name="{{fp.id}}" ng-disabled="!fp.writable"
                               placeholder="{{fp.name}}" ng-model="formData[fp.id]" ng-init="formData[fp.id] = fp.value"
                               ng-required="fp.required">
                    </div>
                    <div class="col-sm-9" ng-if="fp.type.name == 'double' || fp.type.name == 'long'">
                        <input type="number" class="form-control m-b-xs" name="{{fp.id}}" ng-disabled="!fp.writable"
                               placeholder="{{fp.name}}" ng-model="formData[fp.id]" ng-init="formData[fp.id] = fp.value"
                               ng-required="fp.required">
                    </div>
                    <div class="col-sm-9" ng-if="fp.type.name == 'bigtext'">
                                    <textarea name="{{fp.id}}" placeholder="{{fp.name}}" class="form-control m-b-xs"
                                              ng-model="formData[fp.id]"
                                              ng-init="formData[fp.id] = fp.value" ng-required="fp.required"
                                              ng-disabled="!fp.writable"></textarea>
                    </div>
                    <div class="col-sm-9" ng-if="fp.type.name == 'date'">
                        <div class="input-group" d-datepicker ng-model="formData[fp.id]"
                             d-datepicker-option="{format : '{{map.formPropertiesInformation[fp.id].datePattern  | uppercase}}'}">
                            <input type="text" class="form-control m-b-xs" name="{{fp.id}}" ng-disabled="!fp.writable"
                                   placeholder="{{fp.name}}" ng-model="formData[fp.id]"
                                   ng-init="formData[fp.id] = fp.value" ng-required="fp.required">
                                <span class="input-group-btn">
                                    <button type="button" class="btn btn-default m-b-xs" ng-click="open($event)"
                                            ng-disabled="!fp.writable"><i class="glyphicon glyphicon-calendar"></i>
                                    </button>
                                </span>
                        </div>
                    </div>
                    <div class="col-sm-9" ng-if="fp.type.name == 'enum'">
                        <select class="form-control m-b-xs" name="{{fp.id}}" placeholder="{{fp.name}}"
                                ng-model="formData[fp.id]" ng-required="fp.required"
                                ng-init="formData[fp.id] = fp.value"
                                ng-options="key as value for (key,value) in map.formPropertiesInformation[fp.id].values"
                                ng-disabled="!fp.writable">
                        </select>
                    </div>
                    <div class="col-sm-9 m-b-xs" ng-if="fp.type.name == 'users'">
                        <select ui-jq="chosen" multiple data-placeholder="请选择人员名单" class="form-control m-b-xs"
                                name="{{fp.id}}" placeholder="{{fp.name}}" ng-model="formData[fp.id]"
                                required="fp.required" ng-required="fp.required"
                                ng-init="formData[fp.id] = fp.value" ng-options="row.id as row.name for row in userList"
                                ng-disabled="!fp.writable">
                        </select>
                    </div>
                    <div class="col-sm-9" ng-if="fp.type.name == 'javascript'">
                        <script type="text/javascript"></script>
                    </div>
                    <div ng-if="fp.type.name != 'javascript'"
                         class="line line-dashed b-b line-lg pull-in  no-paging no-border"></div>
                </div>
            </div>
            <footer class="panel-footer  lter">
                <!-- alert -->
                <div class="m-b-md">
                    <uib-alert ng-repeat="alert in Alert.alerts" type="{{alert.type}}" close="Alert.closeAlert($index)">
                        {{alert.msg}}
                    </uib-alert>
                </div>
                <!-- / alert -->
                <button type="submit" class="btn btn-success" ng-disabled="form.$invalid || saveBtnDisable"
                        ng-click="complete(task.id); saveBtnDisable = true;">完成任务
                </button>
                <button type="submit" class="btn btn-success" ng-if="!task.assignee" ng-click="claim(task.id); saveBtnDisable = true;">签收
                </button>
                <button type="submit" class="btn btn-success" ng-click="canle()">返回</button>
            </footer>
        </ng-form>
        <div class="col-sm-12">
            <!-- 添加意见 -->
            <div class="col-sm-4">
                <h4 style="border-bottom: 1px solid #eee"><i class="glyphicon glyphicon-comment"
                                                             style="color: green"></i>&nbsp;添加办理意见
                    <button id="saveComment" type="button" class="btn pull-right" style="margin-top: -10px;"
                            ng-click="saveComment(task.id)">
                        <i class="glyphicon glyphicon-plus"></i>保存意见
                    </button>
                </h4>
                <textarea ng-model="other.comment" rows="3" style="width: 100%"></textarea>
            </div>

            <!-- 列表是通过js发送ajax请求后动态生成的 -->
            <div id="commentList" class="col-sm-8">
                <h4 style="border-bottom: 1px solid #eee"><i class="glyphicon glyphicon-list" style="color: green"></i>&nbsp;任务相关事件
                </h4>
                <ol>
                    <li ng-repeat="v in eventMap.events | orderBy:'time':true">
                        <span ng-if="'DeleteAttachment' == v.action">
                            <span ng-if="v.userId" style="margin-right: 1em;"><b>{{v.userId }}</b></span>
                            <span class="text-error">删除</span>了附件：{{v.message || v.fullMessage}}
                            <span style="margin-left:1em;"></span>（<span class="text-info">{{eventMap.taskNames[v.taskId]}}</span>）
                            <span class="text-muted">{{v.time | date : 'yyyy-MM-dd HH:mm:ss'}}</span>
                        </span>
                        <span ng-if="'AddAttachment' == v.action">
                            <span ng-if="v.userId" style="margin-right: 1em;"><b>{{v.userId }}</b></span>添加了附件：{{v.message || v.fullMessage}}
                            <span style="margin-left:1em;"></span>（<span class="text-info">{{eventMap.taskNames[v.taskId]}}</span>）
                            <span class="text-muted">{{v.time | date : 'yyyy-MM-dd HH:mm:ss'}}</span>
                        </span>
                        <span ng-if="'AddComment' == v.action">
                            <span ng-if="v.userId" style="margin-right: 1em;"><b>{{v.userId }}</b></span>发表了意见：{{v.message || v.fullMessage}}
                            <span style="margin-left:1em;"></span>（<span class="text-info">{{eventMap.taskNames[v.taskId]}}</span>）
                            <span class="text-muted">{{v.time | date : 'yyyy-MM-dd HH:mm:ss'}}</span>
                        </span>
                        <span ng-if="'DeleteComment' == v.action">
                            <span ng-if="v.userId" style="margin-right: 1em;"><b>{{v.userId }}</b></span><span class="text-error">删除</span>了意见：{{v.message || v.fullMessage}}
                            <span style="margin-left:1em;"></span>（<span class="text-info">{{eventMap.taskNames[v.taskId]}}</span>）
                            <span class="text-muted">{{v.time | date : 'yyyy-MM-dd HH:mm:ss'}}</span>
                        </span>
                    </li>
                </ol>
            </div>
        </div>
    </div>
</div>